<div class="form-group clearfix">
  <div class="form-inline pull-left">
    <nz-tabset style="float:left;" (nzSelectChange)="changeType($event)" [nzSelectedIndex]="activity_type - 1">
      <nz-tab *ngFor="let tab of tabs">
        <ng-template #nzTabHeading>
          {{tab.name}}
        </ng-template>
        <span>{{tab.content}}</span>
      </nz-tab>
    </nz-tabset>
    <div style="float:left;display:flex;align-items: center;margin-left:20px;">
      <span>输入搜索：</span>
      <input type="text" class="form-control" name="searchData" [(ngModel)]="searchData" (keydown)="keyDown($event)" placeholder="商品名称进行搜索">
    </div>
    <div style="float:left;margin-left:20px;display:flex;align-items: center;">
      <span style="float:left;">商品分类：</span>
      <nz-cascader
        class="search-cascader"
        [(ngModel)]="searchType"
        (ngModelChange)="_console($event)"
        [ngModelOptions]="{standalone: true}"
        (nzLoad)="loadData($event)"
        [nzPlaceHolder]="'请选择商品分类'"
        [nzChangeOnSelect]="true"
        [nzAllowClear]="false"
      >
      </nz-cascader>
    </div>
  </div>
  <div class="pull-right">
    <button class="btn btn-default" (click)="reset()">重置搜索</button>
    <button class="btn btn-success" (click)="search()">查询结果</button>
    <!--<div style="margin-top:10px;">-->
      <!--<select style="width:100px;float: right;"  class="form-control" [(ngModel)]="showWhere" (ngModelChange)="selectChange($event)">-->
        <!--<option value="0">显示全部</option>-->
        <!--<option value="1">显示已分类</option>-->
        <!--<option value="2">显示未分类</option>-->
      <!--</select>-->
    <!--</div>-->
  </div>
</div>
<div class="table-responsive">
  <nz-spin [nzTip]="'正在读取任务列表...'" [nzSpinning]="_isSpinning" [nzSize]="'large'" class="admin-spin">
    <table class="table">
      <thead>
      <tr>
        <th style="width:200px;">id</th>
        <th style="width:200px;">任务名称</th>
        <th style="width:400px;">任务编号</th>
        <th style="width:200px;">任务分类</th>
        <th style="width:200px;">临时销量</th>
        <th style="width:200px;">实际销量</th>
        <th style="width:200px;">创建时间</th>
        <th style="width:200px;">操作</th>
      </tr>
      </thead>
      <tbody>
      <tr *ngFor="let item of taskList">
        <td>{{ item.id }}</td>
        <td>{{ item.task_name }}</td>
        <td>{{ item.task_no }}</td>
        <td>{{ item.category_name }}</td>
        <td>{{ item.tempory_sales }}</td>
        <td>{{  item.task_data_statistics.task_completed_total }}</td>
        <td>{{ item.created_at }}</td>
        <td>
          <a href="javascript:;" *ngIf="canVisit" (click)="showEditModal(item);">编辑</a>
        </td>
      </tr>
      </tbody>
    </table>
  </nz-spin>
  <div class="text-center">
    <pagination (pageChanged)="pageChanged($event)" [totalItems]="taskTotal" [(ngModel)]="currentPage"
                [itemsPerPage]="itemsPerPage"
                [maxSize]="10"
                previousText="&lsaquo;" nextText="&rsaquo;" firstText="&laquo;" lastText="&raquo;"
                [boundaryLinks]="true" class="pagination-sm">
    </pagination>
  </div>
</div>
<app-notification [type]="type" [message]="message" [isShow]="isShow"
                  (promptIsShow)="isShow = $event;"></app-notification>


<div class="modal fade" bsModal #editModal="bs-modal" tabindex="-1" (onHidden)="handler('onHide', $event)">
  <div class="modal-dialog modal-xs">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title pull-left">编辑</h4>
        <button type="button" class="close pull-right" aria-label="Close" (click)="editModal.hide()">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <form #addRejectForm="ngForm">
          <div class="form-group clearfix">
            <label class="col-md-2">临时销量:</label>
            <div class="col-md-8">
              <input type="number" class="form-control" name="tempory_sales" (click)="closeCascader()" [(ngModel)]="tempory_sales">
            </div>
          </div>
          <div class="form-group clearfix">
            <label class="col-md-2">分类:</label>
            <div class="col-md-8">
              <app-cascader (categoryChange)="selected($event)" [status]="cascaderStatus" [firstList]="first_category_list" [secondList]="second_category_list" [info]="info"></app-cascader>
              <!--<nz-cascader-->
                <!--[(ngModel)]="_value"-->
                <!--(ngModelChange)="_console($event)"-->
                <!--(nzChange)="_console($event)"-->
                <!--[ngModelOptions]="{standalone: true}"-->
                <!--(nzLoad)="loadData($event)"-->
                <!--[nzPlaceHolder]="'请选择分类'"-->
                <!--[nzAllowClear]="false"-->
              <!--&gt;-->
              <!--</nz-cascader>-->
            </div>
          </div>
          <div class="form-group clearfix">
            <label class="col-md-2">商品文案:</label>
            <div class="col-md-8">
              <textarea class="form-control" name="description" style="height:200px;" (click)="closeCascader()" [(ngModel)]="description"></textarea>
            </div>
          </div>
          <div class="text-center mt20">
            <button class="btn btn-default btn-md-long" type="button" (click)="cancel()">取　消</button>
            <button class="btn btn-success btn-md-long" type="submit" (click)="addEditSubmit()">提　交</button>
          </div>
        </form>
      </div>
    </div>
  </div>
</div>



<!--<div class="mask" (click)="closeMask()">-->
  <!--<div class="mask-box"></div>-->
  <!--<div class="big-pic-wrap">-->
    <!--<img src="{{ editSrc }}" alt="" class="bigPic" />-->
    <!--<span class="close-pic"><i class="fa fa-close"></i></span>-->
  <!--</div>-->
<!--</div>-->


